  html,
  body {
  	height: 100%
  }
/*  *{
  	padding: 0; margin: 0;
  }*/
  ul{list-style: none;}
  
  .sky {
  	height: 200px;
  	background: #007fd5;
  	position: relative;
  	overflow: hidden;
  	-webkit-animation: sky_background 50s ease-out infinite;
  	-moz-animation: sky_background 50s ease-out infinite;
  	-o-animation: sky_background 50s ease-out infinite;
  	animation: sky_background 50s ease-out infinite;
  	-webkit-transform: translate3d(0, 0, 0);
  	-ms-transform: translate3d(0, 0, 0);
  	-o-transform: translate3d(0, 0, 0);
  	transform: translate3d(0, 0, 0);
  }
  
  .sky .clouds_one {
  	background: url("../images/cloud_one.png");
  	position: absolute;
  	left: 0;
  	top: 0;
  	height: 100%;
  	width: 300%;
  	-webkit-animation: cloud_one 50s linear infinite;
  	-moz-animation: cloud_one 50s linear infinite;
  	-o-animation: cloud_one 50s linear infinite;
  	animation: cloud_one 50s linear infinite;
  	-webkit-transform: translate3d(0, 0, 0);
  	-ms-transform: translate3d(0, 0, 0);
  	-o-transform: translate3d(0, 0, 0);
  	transform: translate3d(0, 0, 0);
  }
  
  .sky .clouds_two {
  	background: url("../images/cloud_two.png");
  	position: absolute;
  	left: 0;
  	top: 0;
  	height: 100%;
  	width: 300%;
  	-webkit-animation: cloud_two 75s linear infinite;
  	-moz-animation: cloud_two 75s linear infinite;
  	-o-animation: cloud_two 75s linear infinite;
  	animation: cloud_two 75s linear infinite;
  	-webkit-transform: translate3d(0, 0, 0);
  	-ms-transform: translate3d(0, 0, 0);
  	-o-transform: translate3d(0, 0, 0);
  	transform: translate3d(0, 0, 0);
  }
  
  .sky .clouds_three {
  	background: url("../images/cloud_three.png");
  	position: absolute;
  	left: 0;
  	top: 0;
  	height: 100%;
  	width: 300%;
  	-webkit-animation: cloud_three 100s linear infinite;
  	-moz-animation: cloud_three 100s linear infinite;
  	-o-animation: cloud_three 100s linear infinite;
  	animation: cloud_three 100s linear infinite;
  	-webkit-transform: translate3d(0, 0, 0);
  	-ms-transform: translate3d(0, 0, 0);
  	-o-transform: translate3d(0, 0, 0);
  	transform: translate3d(0, 0, 0);
  }
  
  @-webkit-keyframes sky_background {
  	0% {
  		background: #007fd5;
  		color: #007fd5
  	}
  	50% {
  		background: #333;
  		color: #a3d9ff
  	}
  	100% {
  		background: #007fd5;
  		color: #007fd5
  	}
  }
  
  @-moz-keyframes sky_background {
  	0% {
  		background: #007fd5;
  		color: #007fd5
  	}
  	50% {
  		background: #333;
  		color: #a3d9ff
  	}
  	100% {
  		background: #007fd5;
  		color: #007fd5
  	}
  }
  
  @keyframes sky_background {
  	0% {
  		background: #007fd5;
  		color: #007fd5
  	}
  	50% {
  		background: #333;
  		color: #a3d9ff
  	}
  	100% {
  		background: #007fd5;
  		color: #007fd5
  	}
  }
  
  @-webkit-keyframes cloud_one {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @-moz-keyframes cloud_one {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @keyframes cloud_one {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @-webkit-keyframes cloud_two {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @-moz-keyframes cloud_two {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @keyframes cloud_two {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @-webkit-keyframes cloud_three {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @-moz-keyframes cloud_three {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  
  @keyframes cloud_three {
  	0% {
  		left: 0
  	}
  	100% {
  		left: -200%
  	}
  }
  /*头部样式*/
  
/*  .header {
  	position: absolute;
  	top: 0px;
  	left: 0px;
  	background-color: rgba(255, 255, 255, 0.4);
  	width: 100%;
  	height: 200px;
  }
  .header>.nav{
  	position: absolute;
  	bottom: 0px;
  }
  .header>.nav>li{
  	float: left;
  	
  }*/
  #shownav>li:hover{
  	background-color: #E7E7E7;
  	 /*transform:skew(-30deg);   -webkit-transform: skew(-30deg);   -moz-transform: skew(-30deg);   -o-transform:skew(-30deg);   -ms-transform:skew(-30deg);   background-color: red;*/
  }
  main h3{
  	text-align: center;
  	background-color: #E7E7E7;
  	padding: 5px 0;
  	}
#list_main>ul{
	/*width: 100%;*/
	padding: 0 20px;
	overflow: hidden;
}
#list_main>ul>a>li{
	margin: 0 5px 5px;
	float: left;
	border: 1px solid #E7E7E7;
	padding: 3px;
	min-width: 60px;
	text-align: center;
}
#list_main li:hover{
	background: #E2E2E2;
	cursor: pointer;
}
#list_main .navbar{
	overflow: hidden;
}
footer>div{
	text-align: center;margin: 5px 0;padding: 15px 0; border-top: 3px double #CCC;background-color: #eee;color: #555;font-size: 13px;
}


